//返回首页
$(".ph-logo").click(function (e) {
    var e = e || event
    e.preventDefault ? e.preventDefault() : e.returnValue = false;
    //console.log("halou")
    location.assign("./index.html");

})
//渲染购物车
function xuanran() {
    //---------------------获取数据----------------------------
    var chang = localStorage.getItem("cctv")
    var hong = JSON.parse(chang);
    //console.log(hong);
    var zongji = document.querySelector(".zongji")
    var zongjison = zongji.children[1];
    //-----------------------------渲染页面-----------------------------
    var html = '<h1 class="hone">拼夕夕购物车</h1>';

var zongji=0
    for (var i = 0; i < hong.length; i++) {
       // console.log(hong.length)
        var shuliang = hong[i].count;
    
        var changs = `
        <div class="shopcar_list">
            <input type="checkbox" class="check" >
            <div class="img_box">
                <img src=${hong[i].hd_thumb_url} alt="">
                <div class="thumb">${hong[i].short_name}</div>
            </div>
            <div class="jiage"><i>单价：</i><i class="ii">${hong[i].normal_price / 100}</i><i>元</i></div>
            <div class="shuliang">
                <button class="jian">-</button>
                <input class="me" type="text" placeholder="${shuliang}">
                <button class="jia">+</button>
            </div>
            <span class="left_span">共:   </span>
            <div class="zongjia">${(hong[i].normal_price / 100 * shuliang)}</div>
            <span class="right_span">元</span>
            <button class="shanchu">删除</button>

        </div>`
        html += changs;

    }
    $(".box").html(html);
    //------------------------获取元素----------------------------
    var jians = document.querySelectorAll(".jian");
    var me = document.querySelectorAll(".me");
    var jias = document.querySelectorAll(".jia");
    var zongjias = document.querySelectorAll(".zongjia");
    //console.log(zongjias);
   
    //console.log(zongjison);
    var shanchu = document.querySelectorAll(".shanchu");
    var check=document.querySelectorAll(".check")
    //-------------------------循环给DOM添加事件---------------------------------------------------
    for (let i = 0; i < jians.length; i++) {
        //console.log(jias.length)
        var ii=document.querySelectorAll(".ii");
        
        
        //--------------点击- 输入框中的数字-1-------------------------
        jians[i].onclick = function () {
            
           
            var atrrbut = me[i].getAttribute("placeholder")
            atrrbut--;
            if (atrrbut === 0) {
                return false;
            }
            if(check[i]){
                console.log("nihao")
                zongjison.innerText =zongjias[i].innerText-Number(ii[i].innerText);
            }else if(!check[i]){
                zongjison.innerText-=zongjias[i].innerText;
            }
            me[i].setAttribute("placeholder", atrrbut)
            hong[i].count--;
            zongjias[i].innerHTML = atrrbut * hong[i].normal_price / 100;
            

        }
        //-----------------点击+ 输入框中的数字+1---------------------------------
        var nm=0
        jias[i].onclick = function () {
            if(!check[i].checked){
                return false
            }else if(check[i].checked){
                nm += Number(ii[i].innerText)
                zongjison.innerText= nm+ Number(ii[i].innerText);  
            }
            var atrrbut = me[i].getAttribute("placeholder")
            atrrbut++
            me[i].setAttribute("placeholder", atrrbut)
            zongjias[i].innerHTML = atrrbut * hong[i].normal_price / 100;
            hong[i].count++;
           
        }
        var changhong = Array.from(hong);

        //------------------点击删除按钮，删除数组中的数据并重新设置localstorage----------------------------------
        shanchu[i].onclick = function () {
            //console.log(changhong[i])
            changhong.splice(i, 1);

            if (changhong == []) {
                return false;
            }
            changhongs = JSON.stringify(changhong)
            localStorage.setItem("cctv", changhongs);
            history.go(0);

        }
        //-------------多选框改变事件计算购买一共需要多少钱并渲染到页面----------------------
        var aa=0;
        check[i].onchange=function() {
            if(this.checked){
                aa += Number(zongjias[i].innerHTML);
            }else{
                aa -= Number(zongjias[i].innerHTML);
                
            }
            
            console.log(aa);
            zongjison.innerHTML=aa;
            
        }
        
     
         
        
    }
}


xuanran()